<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp"%>
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body class="gray-bg">
	<div class="wrapper wrapper-content">
		<div class="row">
			<div class="wrapper wrapper-content animated fadeInRight">
				<div class="row">
					<div class="col-sm-12">
						<div class="ibox float-e-margins">
							<div class="ibox-title">
								<h5>查询条件</h5>
							</div>
							<div class="ibox-content">
								<form id="queryForm" class="form-inline">
									<div class="form-group">
										<label class=" control-label">菜单：</label>
										<input type="text" name="likeName" placeholder="菜单" class="form-control">
									</div>
									<div class="form-group">
										<label class=" control-label">日期范围：</label>
										<input type="text" id="searchDate" name="searchDate" placeholder="菜单" class="form-control" placeholder=" - ">
									</div>

									<div class="form-group">
										<button class="btn btn-outline btn-primary btn-lg" id="queryBtn" style="margin-left: 20px" type="button">
											<i class="fa fa-search"></i>&nbsp;查询
										</button>
										<button class="btn btn-outline btn-default btn-lg" id="queryBtn" style="margin-left: 20px" type="reset">
											<i class="fa fa fa-recycle"></i> &nbsp;清空
										</button>
									</div>
								</form>
							</div>
						</div>
						<div class="ibox-content forum-container">
							<table id="queryTable"></table>
						</div>

					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		$(function() {

			//1.初始化Table
			var oTable = new TableInit();
			oTable.Init();

			$("#queryBtn").click(function() {
				$("#queryTable").bootstrapTable('refresh');
			});

			layui.use('laydate', function() {
				var laydate = layui.laydate;

				//执行一个laydate实例
				laydate.render({
					elem : '#searchDate',
					range : true,
					theme : 'molv'
				});
			});

		});

		var TableInit = function() {
			var oTableInit = new Object();
			//初始化Table
			oTableInit.Init = function() {
				var config = bootstrapTableConfig();
				config.url = '${ctx}/log/list';
						config.queryParams = oTableInit.queryParams,// 传递参数（*）
						config.columns = [
								//	{checkbox : false},
								{
									//field: 'Number',//可不加  
									title : '序号',//标题  可不加  
									formatter : function(value, row, index) {
										return index + 1;
									}
								},
								{
									field : 'id',
									title : '操作',//标题  可不加  
									formatter : function(value, row, index) {
										return '<shiro:hasPermission name="log_view"> <button class="btn btn-default btn-circle" type="button" data-toggle="tooltip" data-placement="bottom" title="查看详情" onclick="detail(\''
												+ value + '\')"><i class="fa fa-ellipsis-h"></i></button> </shiro:hasPermission>'
									}
								}, {
									field : 'menu',
									title : '菜单'
								}, {
									field : 'requestUri',
									title : '请求地址'
								}, {
									field : 'ipAddr',
									title : 'ip地址'
								}, {
									field : 'createByUserName',
									title : '创建人'
								}, {
									field : 'typeName',
									title : '日志类型'
								}, {
									field : 'createDate',
									title : '时间'
								} ];
				$('#queryTable').bootstrapTable(config);
			};
			//得到查询的参数
			oTableInit.queryParams = function(params) {
				var form = formToJson("queryForm");
				form.limit = params.limit;
				form.offset = params.offset;
				if (form.searchDate != '') {
					var arr = form.searchDate.split(" - ");
					form.startDate = arr[0] + " 00:00:00";
					form.endDate = arr[1] + "23:59:59";
				}
				return form;
			};
			return oTableInit;
		};
		function detail(id) {
			openWindows('查看', "${ctx}/log/view?id=" + id);
		}
	</script>
</body>
</html>